Ext.define('HRMobile.view.chart.StructureChart', {
	extend : 'Ext.chart.Chart',
	config : {
		height : '100%',
		autoDestroy: 'true',
		store : {
			fields : [ 'unit', 'number' ],
			autoLoad: true,
			 proxy: {
		         type: 'jsonp',
		         reader: {
		        	 rootProperty: 'Structure Distribution',
		        	 type: 'json'
		         },
		         
		         url: 'http://mw.xalo.vn/HREntry/MobileAPI?type=human&n=3&contentType=text/javascript',
		         
			 }
		
		},

		// define the x and y-axis configuration.
		axes : [ {
			type : 'numeric',
			position : 'left',
			grid : true,
			minimum : 0
		}, {
			type : 'category',
			position : 'bottom',
			label: {
		        rotate: {
		            degrees: 330
		        }
		    }
		} ],

		// define the actual bar series.
		series : [ {
			type : 'bar',
			xField : 'unit',
			yField : [ 'number' ],
			axis : 'bottom',
			highlight : true,
			showInLegend : true,
			style : {
				stroke : 'rgb(40,40,40)',
			
			},
			// Cycles the red, green, and blue fill mode over the 2008, 2009,..,
			// 2011, 2012 items
			// subStyle parameters also override style parameters
			subStyle : {
				fill : [ "#115fa6", "#94ae0a", "#a61120", "#ff8809", "#ffd13e",
						"#a61187", "#24ad9a", "#7c7474", "#a66111" ]
			}
		} ]
	}

});